<html>
    <head>
        <title>Asp.net core mvc / Razor pages : Layout Hooks</title>
    </head>
    <body>
        <script>
            // ASP.NET core MVC/Razor页面：布局挂钩


                    /*
                            ABP主题系统将页面布局放入主题NuGet包中。

                            这意味着最终应用程序不包含Layout.cshtml，因此您不能直接更改布局代码来自定义它。

                            您将主题代码复制到您的解决方案中。在这种情况下，您可以完全自由地对其进行自定义。

                            但是，您将无法获得主题的自动更新（通过升级主题NuGet包）。

                            ABP提供了自定义UI的不同方式。

                            Layout Hook System允许您在布局的某些特定部分添加代码。

                            所有主题的所有布局都应实现这些挂钩。最后，您可以将视图组件添加到挂钩点中。
                        
                    */

                    /*
                        示例：添加Google Analytics脚本

                                        1、如何使用挂钩添加自定义视图组件到布局？

                                                        假设您需要将Google Analytics脚本添加到布局中（可用于所有页面）。首先，在您的项目中创建一个视图组件：

                                                            ★、NotificationViewComponent.cs

                                                                    public class GoogleAnalyticsViewComponent : AbpViewComponent
                                                                    {
                                                                        public IViewComponentResult Invoke()
                                                                        {
                                                                            return View("/Pages/Shared/Components/GoogleAnalytics/Default.cshtml");
                                                                        }
                                                                    }

                                                            ★、Default.cshtml

                                                                <script>
                                                                            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                                                                                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                                                                                    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                                                                            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

                                                                            ga('create', 'UA-xxxxxx-1', 'auto');  // 使用您自己的代码更改UA-xxxxxx-1。
                                                                            ga('send', 'pageview');
                                                                    </、script>

                                                        然后，您可以将此组件添加到模块的ConfigureServices中的任何挂钩点：

                                                                Configure<AbpLayoutHookOptions>(options =>
                                                                {
                                                                    options.Add(
                                                                        LayoutHooks.Head.Last, //The hook name
                                                                        typeof(GoogleAnalyticsViewComponent) //The component to add
                                                                    );
                                                                });

                                                        现在，GA代码将作为最后一项插入到页面的head中。

                                            
                                        2、 指定布局 Specifying the Layout

                                                      上面的配置将GoogleAnalyticsViewComponent添加到所有布局。您可能只想添加到特定布局：
                                                      
                                                                Configure<AbpLayoutHookOptions>(options =>
                                                                {
                                                                    options.Add(
                                                                        LayoutHooks.Head.Last,
                                                                        typeof(GoogleAnalyticsViewComponent),
                                                                        layout: StandardLayouts.Application //  选择要挂载到哪个布局
                                                                    );
                                                                });

                                                            请参阅下面的布局部分以了解有关布局系统的更多信息。
                    */

                    /*
                         二、布局钩子挂点   Layout Hook Points

                                    有一些预定义的布局挂点。

                                    上面使用的LayoutHooks.Head.Last就是其中之一。
                                    
                                    标准钩点是：

                                            ①、LayoutHooks.Head.First：用于在超文本标记语言head标记中添加一个组件作为第一项。

                                            ②、LayoutHooks.Head.Last：用于在超文本标记语言head标记中添加一个组件作为最后一项。

                                            ③、LayoutHooks.Body.First：用于在超文本标记语言body标记中添加一个组件作为第一项。

                                            ④、LayoutHooks.Body.Last：用于在超文本标记语言body标记中添加一个组件作为最后一项。

                                            ⑤、LayoutHooks.PageContent.First：用于在页面内容之前添加组件（布局中的@RenderBody()）。

                                            ⑥、LayoutHooks.PageContent.Last：用于在页面内容之后添加组件（布局中的@RenderBody()）。

                                您（或您正在使用的模块）可以将多个项目添加到同一个挂钩点。所有这些都将按添加顺序添加到布局中。
                    */


                    /*
                         三、布局  Layouts

                                    布局系统允许主题定义标准的、命名的布局，并允许任何页面为其目的选择适当的布局。
                                    
                                    有三种预定义的布局：

                                         ①、Application"：应用程序的主要（和默认）布局。它通常包含页眉、菜单（侧边栏）、页脚、工具栏…等。

                                         ②、Account"：此布局供登录、注册和其他类似页面使用。默认用于/Pages/Account文件夹下的页面。

                                         ③、空"：空的最小布局。

                                    这些名称在StandardLayouts类中定义为常量。您绝对可以创建自己的布局，但这些是标准布局名称，由所有开箱即用的主题实现。


                                    ★、布局位置

                                            你可以在此处找到Basic主题的布局文件。

                                            https://github.com/abpframework/abp/tree/dev/modules/basic-theme/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Basic/Themes/Basic/Layouts
                                                                    
                    */
        </script>
    </body>
</html>